<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script>
            // assign css dynamically
            var fileref = document.createElement("link");
            fileref.setAttribute("rel", "stylesheet");
            fileref.setAttribute("type", "text/css");
            if (chrome.i18n.getMessage("@@bidi_dir") == "ltr") 
                fileref.setAttribute("href", "../css/popup.css");
            else 
                fileref.setAttribute("href", "../css/popup_bidi.css");
            document.getElementsByTagName("head")[0].appendChild(fileref);
        </script>
        <link href="../css/jquery-ui.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="../jquery-1.3.2.min.js">
        </script>
        <script type="text/javascript" src="../jquery.xml2json.js">
        </script>
        <script type="text/javascript" src="../jquery.jfeed.pack.js">
        </script>
        <script type="text/javascript" src="../jquery-ui.min.js">
        </script>
        <script type="text/javascript" src="../common.js?1234">
        </script>
        <script type="text/javascript" src="../controller/popup.js?1234">
        </script>
        <script type="text/javascript" src="../tracking.js?1234">
        </script>
        <script>
            $(document).ready(function(){
            
                $("#tabs").tabs({
                    fxSlide: true,
                    fxFade: true,
                    fxSpeed: 'fast'
                });
                $("#tabs").tabs("option", "selected", 0);
            });
        </script>
    </head>
    <body onLoad="init();">
        <div class="wrapper">
            <img src="../img/fifacom.gif" alt="FIFA.com"><span id="txt_fifacom_url_name"></span>
            <div class="cabecera">
                <span id="txt_fifa_worldcup_title"></span>
            </div>
            <div id="config-container">
                <span id="txt_chrome_extension_config"></span>
            </div>
            <div id="main-container">
                <div id="tabs">
                    <div class="menu">
                        <ul>
                            <li>
                                <a href="#tab1"><span id="popup_txt_tab_1"></span></a>
                            </li>
                            <li>
                                <a href="#tab2"><span id="popup_txt_tab_2"></span></a>
                            </li>
                            <li>
                                <a href="#tab3"><span id="popup_txt_tab_3"></span></a>
                            </li>
                            <li>
                                <a href="#tab4"><span id="popup_txt_tab_4"></span></a>
                            </li>
                        </ul>
                    </div>
                    <div id="tab1">
                        <div class="my-team">
                            <div class="nombre" id="my-team-div" style="cursor:pointer;">
                                <img id="team_flag" style="display:none">&nbsp;<strong><span id="popup_txt_myteam"></span>&nbsp;<span id="popup_txt_myteam_group"></span></strong>
                            </div>
                            <div class="grupos primero">
                                <div>
                                    <span id="popup_txt_latest_news"></span>
                                </div>
                            </div>
                            <div id="div_popup_latest_news">
                                <img style="margin-left: auto; margin-right: auto; display:block;" src="../img/loading.gif" alt="loading..." id="popup_img_loading_latest_news" />
                            </div>
                            <div class="grupos">
                                <div>
                                    <span id="popup_txt_next_match"></span>
                                </div>
                            </div>
                            <div id="div_popup_next_match">
                                <img style="margin-left: auto; margin-right: auto; display:block;" src="../img/loading.gif" alt="loading..." id="popup_img_loading_next_match"/>
                            </div>
                            <div class="bottom">
                            </div>
                            <div class="grupos">
                                <div>
                                    <span id="popup_txt_last_match"></span>
                                </div>
                            </div>
                            <div id="div_popup_last_match">
                                <img style="margin-left: auto; margin-right: auto; display:block;" src="../img/loading.gif" alt="loading..." id="popup_img_loading_last_match"/>
                            </div>
                            <div class="bottom">
                            </div>
                        </div>
                    </div>
                    <div id="tab2" class="live">
                        <div id="div_popup_live" align="center" class="live">
                            <img src="../img/loading2.gif" alt="loading..." id="popup_img_loading_live"/>
                            <div id="div_live_matches">
                            </div>
                        </div>
                    </div>
                    <div id="tab3">
                        <select id="cmb_popup_stage_navigation" class="fases" style="display:none">
                        </select>
                        <div id="div_popup_stages" align="center" class="matches">
                            <img src="../img/loading.gif" alt="loading..." id="popup_img_loading_stages"/>
                        </div>
                        <div class="grupos">
                            <div>
                            </div>
                        </div>
                        <div class="masinfo">
                            <span id="popup_more_info"></span>
                        </div>
                    </div>
                    <div id="tab4" class="settings">
                        <div class="grupos">
                            <div>
                            </div>
                        </div>
                        <label for="cmb_my_team" class="select" id="div_my_team">
                            <span id="config_txt_my_team"></span>
							<img id="team_flag_config" style="display:none">
                            <select id="cmb_my_team">
                            </select>
                        </label>
                        <label for="chk_follow_my_team" id="div_follow_my_team">
                            <input type="checkbox" id="chk_follow_my_team"><span id="config_txt_follow_my_team"></span>
                        </label>
                        <label for="chk_follow_my_group_teams" id="div_follow_my_group_teams">
                            <input type="checkbox" id="chk_follow_my_group_teams"><span id="config_txt_follow_my_group_teams"></span>
                        </label>
                        <label for="chk_follow_all_teams" id="div_follow_all_teams">
                            <input type="checkbox" id="chk_follow_all_teams"><span id="config_txt_follow_all_teams"></span>
                        </label>
                        <input type="button" id="popup_btn_save" />
                    </div>
                </div>
                <div id="div_more_info" align="right">
                </div>
            </div>
            </body>
        </html>
